
<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
  <style type="text/css">
    body, html{width: 100%;height: 100%;overflow: hidden;margin:0;padding: 0}
  </style>
  <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=C6123b0bce5652c26eb066341aa22a7d&s=1"></script>
  <script type="text/javascript" src="https://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
  <link rel="stylesheet" href="https://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />

  <title>SearchInfoWindow</title>
</head>
<body>
<div id="map" style="height:100%;-webkit-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;"></div>
<script type="text/javascript">
    var map = new BMap.Map('map');
    var point = new BMap.Point(120.210052,30.179976);
    map.centerAndZoom(point, 18);
    map.enableScrollWheelZoom();
    map.addControl(new BMap.NavigationControl());

    var content = '<div style="line-height:20px;padding:10px 5px">' +
        '<p style="margin:0;">地址：杭州市滨江区滨文路158号标准工业集团4幢410室</p>' +
        '<p style="margin:0;">电话：朱红杰  18814884867</p>' +
        '<p style="margin:0;">邮箱：service@zjctest.com</p>' +
        '</div>';

    //创建检索信息窗口对象
    var searchInfoWindow = null;
    searchInfoWindow = new BMapLib.SearchInfoWindow(map, content, {
        title  : "浙江检创检测技术服务有限公司",      //标题
        width  : 310,             //宽度
        height : 78,              //高度
        panel  : "panel",         //检索结果面板
        enableAutoPan : true,     //自动平移
        searchTypes   :[
            BMAPLIB_TAB_TO_HERE,  //到这里去
            BMAPLIB_TAB_SEARCH,   //周边检索
            BMAPLIB_TAB_FROM_HERE //从这里出发
        ]
    });
    var marker = new BMap.Marker(point); //创建marker对象
    marker.enableDragging(); //marker可拖拽
    marker.addEventListener("click", function(e){
        searchInfoWindow.open(marker);
    })
    map.addOverlay(marker); //在地图中添加marker
    searchInfoWindow.open(marker); //在marker上打开检索信息串口  
</script>
</body>
</html>
</script>
